<template>
  <view class="fullPage">
    <!-- #ifdef MP-WEIXIN -->

    <view :style="{ height: navbarHeight + 'px' }">
      <u-navbar
        leftIconSize="36rpx"
        leftText="返回"
        bgColor="#3867ab"
        leftIconColor="#fff"
        title="考试成绩"
        :autoBack="true"
        titleStyle="color: #fff;font-size: 32rpx;"
      >
      </u-navbar>
    </view>
    <!--  #endif -->

    <view class="pageBody">
      <view class="scoreItem" v-for="(item, index) in scoreList" :key="index">
        <view class="scoreItem_title">
          <view class="scoreType">{{ item.title }}</view>
          <view :class="item.isOk ? 'scoreYes' : 'scoreNo'">{{
            item.isContent
          }}</view>
        </view>
        <view class="scoreItem_content">
          <view class="scoreFen" style="margin-right: 112rpx">考试成绩</view>
          <view class="scoreFen">{{ item.score }}分</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      navbarHeight: 0, // 默认高度
      toolType: "",
      scoreList: [],
      list: [
        {
          title: "科目一(C1)",
          score: "99",
          isContent: "",
          isOk: true,
        },
        {
          title: "科目二(C1)",
          score: "80",
          isContent: "",
          isOk: true,
        },
        {
          title: "科目三  道路驾驶技能考试(C1)",
          score: "100",
          isContent: "",
          isOk: true,
        },
        {
          title: "科目三  安全文明常识考试(C1)",
          score: "96",
          isContent: "",
          isOk: true,
        },
      ],
    };
  },

  methods: {
    scoreIsYes(title, score) {
      let isContent = "合格";
      let isOk = true;

      if (parseInt(score) >= 80 && title.indexOf("科目二") > -1) {
        isOk = true;
        isContent = "合格";
      } else {
        isOk = false;
        isContent = "不合格";
      }

      if (parseInt(score) >= 90) {
        isOk = true;
        isContent = "合格";
      }

      if (parseInt(score) == 0) {
        isOk = false;
        isContent = "未考试";
      }

      return { isContent, isOk };
    },
    resetData() {
        this.scoreList = [];
        uni.getStorage({
	key: 'score_key',
	success:  (res)=> {
		console.log(res.data);
        let list = res.data;
        list.forEach((item, index) => {
        this.scoreList.push({
          title: item.title,
          score: item.score,
          isContent: this.scoreIsYes(item.title, item.score).isContent,
          isOk: this.scoreIsYes(item.title, item.score).isOk,
        });
      });
	}
});
    
    },
    // 获取设备信息并计算 navbar 高度
    setNavbarHeight() {
      uni.getSystemInfo({
        success: (res) => {
          // 假设 navbar 高度为 44px 加上状态栏高度
          this.navbarHeight = 44 + res.statusBarHeight;
          console.log("设备信息", this.navbarHeight);
        },
        fail: (err) => {
          console.error("获取系统信息失败", err);
        },
      });
    },
  },
//   onLoad(options) {
//     this.resetData();
//     this.setNavbarHeight();
//   },
  onShow() {
    this.resetData();
    this.setNavbarHeight();
  }
};
</script>
<style lang="scss" scoped>
.fullPage {
  height: 100vh;
  background: #f7f8fa;
  .pageBody {
    padding: 0 34rpx;
    // padding-top: 176rpx;
    .scoreItem {
      width: 646rpx;
      height: 120rpx;
      margin-top: 26rpx;
      background: #fff;
      border-radius: 15rpx;
      padding: 36rpx 0rpx 36rpx 36rpx;
      .scoreItem_title {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        .scoreType {
          font-size: 34rpx;
          color: #232323;
          font-weight: 600;
          margin-right: 28rpx;
        }
        .scoreYes {
          height: 28rpx;
          padding: 10rpx 18rpx 10rpx 18rpx;
          font-size: 28rpx;
          line-height: 26rpx;
          background: #afe6bf;
          color: #50a473;
          border-radius: 10rpx;
        }
        .scoreNo {
          height: 28rpx;
          padding: 10rpx 18rpx 10rpx 18rpx;
          font-size: 28rpx;
          line-height: 26rpx;
          background: #fcc8c8;
          color: #f56c6c;
          border-radius: 10rpx;
        }
      }

      .scoreItem_content {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-top: 34rpx;
        .scoreFen {
          color: #0b0b0b;
          font-size: 32rpx;
        }
      }
    }
  }
}
</style>
